<template>
	<view>
		<template v-if="username">
			<view class="u-m-l-20">
				<u-form :model="form" ref="uForm">
					<u-form-item label="名称" prop="shopName">
						<u-input v-model="form.shopName" type="text" />
					</u-form-item>
					<u-form-item label="价格" prop="price">
						<u-input v-model="form.price" type="number" />
					</u-form-item>
					<u-form-item label="库存" prop="stock">
						<u-input v-model="form.stock" type="number" />
					</u-form-item>
					<u-form-item label="商品详细信息" prop="shopDetails">
						<u-input v-model="form.shopDetails" type="text" />
					</u-form-item>
					<u-form-item label="商品封面图片" prop="indexUrl">

						<u-image width="50%" height="300rpx" :src="form.indexUrl" @click="uploadindexImage">
							<!-- <u-loading slot="loading"></u-loading> -->
						</u-image>
						<u-icon name="close-circle" color="#2979ff" size="50" label="清空图片" @click="clearIndexUrl">
						</u-icon>
					</u-form-item>
					<u-form-item label="商品详情图片" prop="detailUrl">
						<u-image width="50%" height="300rpx" :src="form.detailUrl" @click="uploadDetailImage"></u-image>
						<u-icon name="close-circle" color="#2979ff" size="50" label="清空图片" @click="clearDetailUrl">
						</u-icon>
					</u-form-item>
				</u-form>
			</view>
			<view class="">
				<u-button class="btn" @click="submit">提交</u-button>
			</view>
		</template>

		<template v-else>
			<u-empty text="暂无权限" mode="permission"></u-empty>
			<view class="u-flex u-row-center" style="color: #1296db;" @click="toLogin">点击去登录</view>
		</template>
	</view>
</template>

<script>
	let _this = {}
	export default {
		data() {
			return {
				username: '',
				form: {
					shopName: '',
					price: '',
					stock: '',
					sales: 0,
					shopDetails: '',
					indexUrlList: [],
					detailUrlList: [],
					indexUrl: '',
					detailUrl: '',
					goodsId: '',
					isCheck: true,
					num: 1,
				},
				rules: {
					shopName: [{
						required: true,
						message: '请输入商品名称',
						trigger: ['change', 'blur']
					}],
					price: [{
						required: true,
						message: '请输入商品价格',
						trigger: ['change', 'blur']
					}],
					stock: [{
						required: true,
						message: '请输入商品库存',
						trigger: ['change', 'blur']
					}],
					// indexUrl: [{
					// 	required: true,
					// 	message: '请输入商品封面图',
					// 	trigger: ['change', 'blur']
					// }]
				}
			};
		},
		created() {
			_this = this
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		onShow() {
			this.getGoodsList()
			try {
				const username = uni.getStorageSync('username');
				if (username) {
					this.username = username
				}
			} catch (e) {
				// error
			}
		},
		methods: {
			//获取商品列表数据
			getGoodsList() {
				const username = uni.getStorageSync('username');
				uniCloud.callFunction({
					name: "listGoods",
					data: {
						username: username
					}
				}).then(res => {
					this.form.goodsId = res.result.data.length + 1
					// console.log(this.form.goodsId)
					// console.log(typeof(this.form.goodsId))

				})
			},
			//首页图片上传
			uploadindexImage() {
				console.log("111")
				uni.chooseImage({
					count: 1,
					success: images => {
						console.log(images)
						// console.log(images.tempFiles[0].name)
						uniCloud.uploadFile({
							filePath: images.tempFilePaths[0],
							// //#ifdef H5
							// cloudPath: images.tempFiles[0].name,
							// //#endif 
							// // #ifndef H5
							// cloudPath: images.tempFiles[0].path,
							// //#endif
							cloudPath: 'a.jpg',
							success(res) {
								// 		
								_this.form.indexUrl = res.fileID
								console.log(_this.form.indexUrl)
								// _this.form.detailUrlList.push(_this.form.indexUrl)
								// obj.imgUrl = res.fileID
								// 			// that.article1.push(res)
								// 			that.form.bannerUrl.push(obj)
								// 			console.log(that.form.bannerUrl)
							}
							// 	
						})
					}
				})
			},
			//详情图片上传
			uploadDetailImage() {
				console.log("222")
				uni.chooseImage({
					count: 1,
					success: images => {
						console.log(images)
						console.log(images.tempFiles[0].name)
						uniCloud.uploadFile({
							filePath: images.tempFilePaths[0],
							// cloudPath: images.tempFiles[0].name,
							cloudPath: 'a.jpg',
							success(res) {
								// 		
								_this.form.detailUrl = res.fileID
								console.log(_this.form.detailUrl)
								// _this.form.detailUrlList.push(_this.form.indexUrl)
								// obj.imgUrl = res.fileID
								// 			// that.article1.push(res)
								// 			that.form.bannerUrl.push(obj)
								// 			console.log(that.form.bannerUrl)
							}
							// 	
						})
					}
				})
			},

			//提交
			submit() {

				this.$refs.uForm.validate(valid => {
					if (valid) {
						// this.getGoodsList()
						// this.form.goodsId = parseInt(this.form.goodsId)
						this.form.price = parseInt(this.form.price)
						this.form.stock = parseInt(this.form.stock)

						// var that = this;
						// that.form.indexUrl = that.form.indexUrlList[0]
						// this.form.detailUrl = this.form.detailUrlList[0]
						let form = {
							...this.form
						}
						let url = 'addGoods'

						uniCloud.callFunction({
							name: url,
							data: {
								...form,
							}
						}).then((res) => {
							_this.$u.toast('提交成功')
							setTimeout(() => {
								this.form = {}
								this.$u.route({
									type: 'switchTab',
									url: '/pages/index/index'
								});
							}, 2000)
						})


					} else {
						this.$u.toast('验证失败')
					}
				});
			},
			clearIndexUrl() {
				console.log(1);
				this.form.indexUrl = ''
			},
			clearDetailUrl() {
				console.log(2);
				this.form.detailUrl = ''
			},
			toLogin() {
				type: 'reLaunch',
				this.$u.route('/pages/user/login');
			}
		}
	}
</script>

<style lang="scss">
	.btn {
		margin-top: 60rpx;
	}
</style>
